<p>This rule raises an issue when code uses <code>typeof variable === 'undefined'</code> or <code>typeof variable !== 'undefined'</code> to check if a
value is undefined.</p>
<h2>Why is this an issue?</h2>
<p>Using <code>typeof</code> to check for <code>undefined</code> values is unnecessarily verbose and makes code harder to read. The pattern
<code>typeof value === 'undefined'</code> was historically necessary in older JavaScript versions (pre-ES5) because the global <code>undefined</code>
could be reassigned. However, this is no longer a concern in modern JavaScript environments.</p>
<p>The <code>typeof</code> operator returns a string, which means you’re comparing strings rather than directly checking the value. This adds an extra
layer of complexity that serves no purpose in most cases. Direct comparison with <code>undefined</code> is more straightforward and expressive.</p>
<p>The only legitimate use case for <code>typeof</code> when checking undefined is when you need to verify if a global variable exists without
throwing a ReferenceError. However, even in this case, using <code>globalThis.variableName === undefined</code> is often a clearer alternative.</p>
<h3>What is the potential impact?</h3>
<p>This issue primarily affects code readability and maintainability. While it doesn’t introduce security vulnerabilities or runtime errors, it makes
the codebase more verbose and harder to understand. Developers may spend extra time parsing the intent of <code>typeof</code> checks when a simple
comparison would be clearer.</p>
<h3>How to fix?</h3>
<p>Replace <code>typeof</code> checks with direct comparison to <code>undefined</code>. This makes the code more concise and easier to read.</p>
<h4>Non-compliant code example</h4>
<pre data-diff-id="1" data-diff-type="noncompliant">
function processValue(value) {
  if (typeof value === 'undefined') { // Noncompliant
    return 'No value provided';
  }
  return value;
}
</pre>
<h4>Compliant code example</h4>
<pre data-diff-id="1" data-diff-type="compliant">
function processValue(value) {
  if (value === undefined) {
    return 'No value provided';
  }
  return value;
}
</pre>
<h3>Documentation</h3>
<ul>
  <li> <a href="https://github.com/sindresorhus/eslint-plugin-unicorn#readme">eslint-plugin-unicorn</a> - Rule <a
  href="https://github.com/sindresorhus/eslint-plugin-unicorn/blob/HEAD/docs/rules/no-typeof-undefined.md">no-typeof-undefined</a> </li>
  <li> MDN - typeof operator - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof">Documentation about the
  typeof operator and its use cases</a> </li>
  <li> MDN - undefined - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined">Documentation about the
  undefined primitive value</a> </li>
  <li> MDN - globalThis - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis">Documentation about
  globalThis for accessing global variables safely</a> </li>
</ul>
